import * as echarts from "echarts"
import type { EChartsOption } from "echarts"
import { onBeforeUnmount } from "vue"

type TRanderer = "svg" | "canvas"

export default function useEchart(divEl: HTMLElement, randerer: TRanderer) {
  const echartInstance = echarts.init(divEl, null, { renderer: randerer })

  // 为了方便 该 hooks 的使用
  function setOption(option: EChartsOption) {
    echartInstance.setOption(option)
  }

  function resizeEchart() {
    echartInstance.resize()
  }

  onBeforeUnmount(() => {
    echartInstance.dispose() // 销毁实例
  })

  return {
    echartInstance,
    setOption,
    resizeEchart
  }
}
